/*
 * @Description: 
 * @Author: 葛玉根
 * @Date: 2021-03-08 00:18:00
 * @LastEditTime: 2021-03-08 18:07:32
 * @LastEditors: 葛玉根
 */
import React, { FC, Fragment, useState } from 'react'
import {  Modal, Button, Input, Form, Select } from 'antd';
import { useDispatch, useSelector, ClassModelState } from 'umi';
interface Iprops{
    text: any,
    grade_id:string
}
let Edit: FC<Iprops> = function (props) {
    const [isModalVisible, setIsModalVisible] = useState(false);
    const dispatch = useDispatch()
    let { roomData, curriculumData } = useSelector((model: { classAdministration: ClassModelState }) => model.classAdministration)

    const { Option } = Select;

    const showModal = () => {
        dispatch({
            type: 'classAdministration/getRoomData'
        })
        dispatch({
            type: 'classAdministration/getCurriculumData'
        })
        setIsModalVisible(true);
    };
    const handleOk = () => {
        setIsModalVisible(false);
    };

    const handleCancel = () => {
        setIsModalVisible(false);
    };
    const onFinish = (values: any) => {
        dispatch({
            type: 'classAdministration/editClass',
            payload: {
                grade_id: props.grade_id,
                subject_id: values.subject_id,
                grade_name: values.grade_name,
                room_id: values.room_id
            }
        })
        handleOk()
    };
    return (
        <Fragment>
            <Button type="link" onClick={showModal}>
                修改
            </Button>
            <Modal title="修改班级" footer={null} visible={isModalVisible} onCancel={handleCancel}>
                <Form
                    name="basic"
                    initialValues={{ remember: true }}
                    onFinish={onFinish}
                >
                    <Form.Item
                        label="班级名"
                        name="grade_name"
                        rules={[{ required: true, message: '班级名不能为空' }]}
                        initialValue={props.text.grade_name}
                    >
                        <Input placeholder="教室名" />
                    </Form.Item>
                    <Form.Item name="room_id" label="教室号" initialValue={props.text.room_text} rules={[{ required: true, message: '教室号不能为空' }]}>
                        <Select
                            placeholder="请选择教室号"
                            allowClear
                        >
                            {roomData.length && roomData.map((item) => {
                                return <Option key={item.room_id} value={item.room_id}>{item.room_text}</Option>
                            })}
                        </Select>
                    </Form.Item>
                    <Form.Item name="subject_id" label="课程名" initialValue={props.text.subject_text} rules={[{ required: true, message: '课程名不能为空' }]}>
                        <Select
                            placeholder="请选择课程名"
                            allowClear
                        >
                            {curriculumData.length && curriculumData.map((item) => {
                                return <Option key={item.subject_id} value={item.subject_id}>{item.subject_text}</Option>
                            })}
                        </Select>
                    </Form.Item>
                    <Form.Item>
                        <Button type="ghost" onClick={handleCancel} style={{ marginLeft: '210px', marginTop: '20px' }}>
                            取消
                            </Button>
                        <Button type="primary" htmlType="submit" style={{ marginLeft: '20px', marginTop: '20px' }}>
                            提交
                            </Button>
                    </Form.Item>
                </Form>
            </Modal>
        </Fragment>
    )
}
export default Edit